<? include ("../init.php") ?>
<? include ("../header.php") ?>
<? include ("../menu.php") ?>
<? include ("submenu.php") ?>
<?php
 $sql = 'SELECT * FROM gallery ORDER BY img_position';
  $rss = $db->query($sql);
  $i = 1;
  $image_gallery = '';
  
  while ($line2 = $db->fetchNextObject($rss)){
    $image_gallery .= <<<image_gallery
      <li id="slideOrder_{$i}">
        <div>
          <img src="../images/ajax-loader.gif" class="ajax_load_img delete_indicator"/>
          <img src="../../images/header_slide/{$line2->img_path}" class="imgGallThumb" />
          <p>
            <a href="edit.php?img_id={$line2->img_id}" id="{$line2->img_id}" class="aLink">Edit</a>
            &nbsp;&nbsp;|&nbsp;&nbsp;<a href="javascript:void(0);" id="{$line2->img_id}" class="aLink deleteImg">Delete</a>
          </p>
        </div>
        <span class="hiddenEle" id="imgOderNew"><p>{$line2->img_id}</p></span>
      </li>
image_gallery;
    ++$i;
  }  
?>
<div id = "body">

<h1><?_l('gallery')?></h1>

<a href = "form.php" class = "add"><img src = "<?=ADMIN?>/images/icon-add.png">&nbsp;&nbsp;&nbsp;<?_l('add-image')?></a>

<div class = "clear"></div>

<div class = "page">
<?
  //$count = $db->countOfAll('showcase');
  //$start = setpage($count);
?>
</div>

<div class = "clear"></div>

<form method="post" action="update-order.php" class = "form">
  <div class = "field">
    ลากรูปภาพเพื่อจัดตำแหน่ง จากนั้นกดปุ่มอัพเดต
  </div>
  
  <div class = "field">
    <div id="tabs-1" class="imagesOrder">
        <ul class="imagesOrderlist" id="list1">
        <?php echo $image_gallery; ?>
        </ul>
        <div class = "clear"></div>
      <input name="list1SortOrder" type="hidden" />
    </div>
  </div>
  <br />
  <div class = "field"><label></label>
    <input type="submit" name="save" value = "<?_l('update')?>" class = "btn" />
  </div>
  
  <div class = "clear"></div>
</form>


</div>

<style>

</style>
<script type="text/javascript" src="../js/jquery.dragsort-0.3.10.js"></script>
  <script type="text/javascript">
      $(document).ready(function(){
          $('.deleteImg').click(function(){
              
              var imgEle = $(this);
              var id = imgEle.attr('id');
              
              if(confirm('Sure?'))
              {
                  imgEle.parents("li").find('.delete_indicator').css('display','inline');
                  $.post('del.php','imgId='+id,function(data){
                      imgEle.parents("li").remove();
                  });
              }
          });
          
          $("#list1").dragsort({ dragSelector: "div", dragBetween: true, dragEnd: saveOrder, placeHolderTemplate: "<li class='placeHolder'><div></div></li>" });
      });
      
      function saveOrder() {
          var serialStr = "";
          $("#list1 li span").each(function(i, elm) {
              serialStr += (i > 0 ? "|" : "") + $(elm).children("p").html();
          });
          
          $("input[name=list1SortOrder]").val(serialStr);
      };
  </script>
<? include "../footer.php" ?>